<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>view video</title>

        <?php echo $this->Html->css('../js/videojs/mediaelementplayer.min.css'); ?>
        <?php echo $this->Html->css('../js/videojs/mejs-skins.css'); ?>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
        <!--[if lt IE 9]>
                <script src="http://wordpress.com/wp-content/themes/twentyfourteen/js/html5.js"></script>
	<![endif]-->
        <?php echo $this->Html->script('videojs/mediaelement-and-player.min.js'); ?>
        <style>
            .info{
                height: 25px;
            }
        </style>
    </head>
    <body>
        <div class="info">
            <span><?php echo $record['customers']['CustName'] ?>&nbsp&nbsp&nbsp&nbsp</span><span><?php echo $record['buildings']['BuildName'] ?>&nbsp&nbsp&nbsp&nbsp</span><span><?php echo $record['cameras']['CamName'] ?>&nbsp&nbsp&nbsp&nbsp</span><span><?php echo Common::convertDate($record['Record']['CrtDt'],'Y-m-d H:i') ?></span>
        </div>
        <video width="500" height="280" src="<?php echo Router::url('/video/', true) . $record['Record']['RecPath'] ?>" type="video/mp4" 
	id="player1" poster="" 
	controls="controls" preload="none">
        </video>
        <script>
        $('audio,video').mediaelementplayer({
                plugins: ['flash', 'silverlight'],
                success: function(player, node) {
                    $('.mejs-overlay-button').trigger('click');    
                }
        });

        </script>
    </body>
</html>
